<template>
  <div>
    御剑乘风来,除魔天地间!
    <ul>
      <li @click="handel1">我是第1个li</li>
      <li @click="handel2">我是第2个li</li>
      <li @click="handel3">我是第3个li</li>
    </ul>
    <router-view></router-view>
  </div>
</template>
<script>
export default {
  name: 'app',
  data () {
    return {

    }
  },
  created () {
  },
  computed: {
  },
  //监听 路由值的变化
  watch: {
    '$route.path' (newValue) {
      console.log(newValue, 9999)

    }
  },
  methods: {
    handel1 () {
      this.$router.push({ path: '/find' }).catch((err) => { err })
    },
    handel2 () {
      this.$router.push({   name: 'My', params: { shuai: '小美'},}
      ).catch((err) => { err })
    },
    handel3 () {
      this.$router.push({
        name: 'Friend', params: { ss: '帅帅', mei: '小美' },
        query: { name: '小美', age: 18 },
      }).catch((err) => { err })
    },
  }
}
</script>
<style lang='less'  scoped>
</style>
